import { Component, OnInit } from '@angular/core';
import {HttpClient} from '@angular/common/http'
import { Router } from '@angular/router'

@Component({
  selector: 'app-signup',
  templateUrl: './signup.component.html',
  styleUrls: ['./signup.component.css']
})
export class SignupComponent implements OnInit {
  signupForm = {
    email: '',
    password: '',
  }
  constructor(
    private http:HttpClient,
    private router:Router,
    ) { }

  ngOnInit(): void {
  }

  signup():void{
    /**
     * 1，表单验证，
     * 2，获取表单数据
     * 3，发起请求与服务端交互
     * 4，根据响应结果进行相应处理
     */
    const formData = this.signupForm
    this.http.post('http://localhost:3000/users',formData)
    .toPromise()
    .then((data:any)=>{
        // window.alert("注册成功")
        // 传递数据处理
        window.localStorage.setItem('userinfo', data.user);
        // 路由跳转到登录页面
        this.router.navigate(['/signin']);
    }).catch(err=>{
      // 如果用户名已被占用
      if(err.status == 409){
        window.alert("用户名已被占用")
      }else{
        window.alert("未知错误出现，请重新选择注册用户名和密码")
      }
    })
  }

}
